﻿@section HeadContent {
	<link href="/Content/Styles/Users.css" rel="stylesheet" type="text/css" media="screen" />

	<script type="text/javascript">

		$(function ()
		{
			hideDetails();
		});

		function showDetails()
		{
			$('#divDetails').show();
		}
		function hideDetails()
		{
			$('#divDetails').hide();
		}
		function deleteUser(id)
		{
			hideDetails();

			$(id).remove();

			$('#usersTable tbody tr:odd').removeClass('usersTableRow');
			$('#usersTable tbody tr:even').removeClass('usersTableRowAlt');

			$('#usersTable tbody tr:odd').addClass('usersTableRowAlt');
			$('#usersTable tbody tr:even').addClass('usersTableRow');
		}
		
	</script>
}

@section TitleContent {
	User Management
}

				<div class="contentRegion">
					<div class="contentRegionFull">
						<div class="contentRegionHeader">User Management</div>
						<div class="contentRegionContainer">
							<table id="usersTable" width="100%" class="usersTable">
								<thead>
									<tr>
										<th>First Name</th>
										<th>Last Name</th>
										<th>UserName</th>
										<th>Last Login</th>
										<th>Certifications</th>
										<th></th>
									</tr>
								</thead>
								<tbody>
									<tr class="usersTableRow" id="user1">
										<td>John</td>
										<td>Smith</td>
										<td>JohnSmith</td>
										<td>5/5/2011</td>
										<td>Custom Cert 1</td>
										<td><a href="#" onclick="showDetails();">Edit</a> | <a href="#" onclick="deleteUser('#user1');">Delete</a></td>
									</tr>
									<tr class="usersTableRowAlt" id="user2">
										<td>Jim</td>
										<td>Bob</td>
										<td>Jimbo</td>
										<td>1/12/2009</td>
										<td>Custom Cert 8</td>
										<td><a href="#" onclick="showDetails();">Edit</a> | <a href="#" onclick="deleteUser('#user2');">Delete</a></td>
									</tr>
									<tr class="usersTableRow" id="user3">
										<td>Mike</td>
										<td>Something</td>
										<td>MikesUserName</td>
										<td>Never</td>
										<td></td>
										<td><a href="#" onclick="showDetails();">Edit</a> | <a href="#" onclick="deleteUser('#user3');">Delete</a></td>
									</tr>
									<tr class="usersTableRowAlt" id="user4">
										<td>Jane</td>
										<td>Doe</td>
										<td>JaneDoe</td>
										<td>3/25/2011</td>
										<td>Custom Cert 1</td>
										<td><a href="#" onclick="showDetails();">Edit</a> | <a href="#" onclick="deleteUser('#user4');">Delete</a></td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
				</div>
				<div class="contentRegion">
					<div class="contentRegionFull">
						<div class="contentRegionHeader">User Details</div>
						<div class="contentRegionContainer">
							<div id="divDetails">
								<table width="100%">
									<tr>
										<th width="100px">First Name:</th>
										<td colspan="2"><input type="text" value="John" /></td>
									</tr>
									<tr>
										<th>Last Name:</th>
										<td colspan="2"><input type="text" value="Smith" /></td>
									</tr>
									<tr>
										<th>UserName:</th>
										<td colspan="2"><input type="text" value="JohnSmith" /></td>
									</tr>
									<tr>
										<td></td>
										<td><a href="#">Edit Certifications</a></td>
										<td><a href="#">Edit Permissions</a></td>
									</tr>
								</table>
								<div style="text-align:right;"><input type="button" value="Cancel" onclick="hideDetails();" /><input type="button" value="Submit" onclick="hideDetails();" /></div>
							</div>
						</div>
					</div>
				</div>